:root {
    --map_height: 450px;
    --map_width: 600px;

    --table_width: 786.8px;
    
    --th_fontsize: 15.28px;
    --line_fontsize: 15.28px;

    --outlinePage_transition: 80px;
}

@media screen and (max-width: 983.5px) {
    :root {
        --map_height: 45.755vw;
        --map_width: 61.007vw;
    }
}

@media screen and (max-width: 786.8px) {
    :root {
        --table_width: 100%;
    }
}

@media screen and (max-width: 572px) {
    :root {
        --th_fontsize: 2.5vw;
        --line_fontsize: 2.5vw;
        --th_minWidth: 25%;
        --line_minWidth: 70%;

        --outlinePage_transition: 9vw;
    }
}

body {
    margin: 0;
}

#values,
#profile,
#history,
#access {
    padding-top: var(--outlinePage_transition);
    margin-top: calc(-1*var(--outlinePage_transition));
}

.values_gridR {
    display: grid;
    grid-template-rows: repeat(3, auto);
}

.values_gridC {
    display: grid;
    grid-template-columns: 1fr 28fr;
}

.outline_table {
    border-collapse: collapse;
    border-spacing: 0px;
    width: var(--table_width);
    margin: 0 auto;
}

.outline_table th,
.outline_table td {
    border-bottom: 1px solid #bbb;
}

.table_header {
    position: relative;
    min-width: var(--th_minWidth);
    line-height: 16px;
    font-size: var(--th_fontsize);
    font-weight: bold;
    text-align: left;
    color: #333333;
}

.solo_line,
.multi_line {
    min-width: var(--line_minWidth);
}

.solo_line span {
    display: inline-block;
    padding: 0.5vw 0vw;
    font-size: var(--line_fontsize);
}

.multi_line span {
    display: inline-block;
    padding: 0.2vw 0vw;
    font-size: var(--line_fontsize);
}

.multi_line span:last-child {
    display: inline-block;
    padding: 0.2vw 0vw 0.5vw 0vw;
    font-size: var(--line_fontsize);
}

.multi_line span:first-child {
    display: inline-block;
    padding: 0.5vw 0vw 0.2vw 0vw;
    font-size: var(--line_fontsize);
}

.title {
    padding: 20px 0px 0px 0px;
    margin: 0px 0px 20px 0px;
}

iframe {
    width: var(--map_width);
    height: var(--map_height);
}